High Contrast: keycap styling

sync with Adwaita with some styling tweaks.

diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss
index ade3a59d58c8809c97f0ee9e24aab01634fe0e34..86f0473ab89399f3e0f9b8e057905d5226a60701 100644 (file)
--- a/gtk/theme/HighContrast/_common.scss
+++ b/gtk/theme/HighContrast/_common.scss
@@ -2984,14 +2984,24 @@ button.circular label {
   padding: 0;
 }
 
-frame.keycap {
-  background-color: #fefefe;
-  border: 1px solid #cecece;
+// shortcut window keys
+.keycap {
+  min-width: 18px;
+  min-height: 25px;
+  margin-top: 3px;
+  padding-bottom: 2px;
+  padding-left: 6px;
+  padding-right: 6px;
+
+  color: $fg_color;
+  background-color: $base_color;
+  border: 2px solid;
+  border-color: $borders_color;
   border-radius: 5px;
-  box-shadow: 0px 1px 0px #fff inset,
-              0px -2px 0px #dedede inset;
-  color: #555753;
-  padding: 3px 8px 3px 8px;
+  box-shadow: inset 0 -3px mix($borders_color, $bg_color, 50%),
+              inset 0 -2px $bg_color,
+              inset 0 0 0 1px $base_color;
+  font-size: smaller;
 }
 
 *:drop(active):focus,

diff --git a/gtk/theme/HighContrast/gtk-contained-inverse.css b/gtk/theme/HighContrast/gtk-contained-inverse.css
index 8de8d38b35e4c1c8c9fb3c6162d494427be9ae34..60c4f9f6b724c576baf4c381f2ac40ff10c6a53f 100644 (file)
--- a/gtk/theme/HighContrast/gtk-contained-inverse.css
+++ b/gtk/theme/HighContrast/gtk-contained-inverse.css
@@ -3332,13 +3332,20 @@ button.circular {
 button.circular label {
   padding: 0; }
 
-frame.keycap {
-  background-color: #fefefe;
-  border: 1px solid #cecece;
+.keycap {
+  min-width: 18px;
+  min-height: 25px;
+  margin-top: 3px;
+  padding-bottom: 2px;
+  padding-left: 6px;
+  padding-right: 6px;
+  color: #fff;
+  background-color: #111;
+  border: 2px solid;
+  border-color: gray;
   border-radius: 5px;
-  box-shadow: 0px 1px 0px #fff inset, 0px -2px 0px #dedede inset;
-  color: #555753;
-  padding: 3px 8px 3px 8px; }
+  box-shadow: inset 0 -3px #404040, inset 0 -2px #000, inset 0 0 0 1px #111;
+  font-size: smaller; }
 
 *:drop(active):focus,
 *:drop(active) {

diff --git a/gtk/theme/HighContrast/gtk-contained.css b/gtk/theme/HighContrast/gtk-contained.css
index 0174b669a3d69dae8e75f0f46f6ad76d9786c641..21ecff937333aee0b02b29fd5f05d6963fa016fa 100644 (file)
--- a/gtk/theme/HighContrast/gtk-contained.css
+++ b/gtk/theme/HighContrast/gtk-contained.css
@@ -3339,13 +3339,20 @@ button.circular {
 button.circular label {
   padding: 0; }
 
-frame.keycap {
-  background-color: #fefefe;
-  border: 1px solid #cecece;
+.keycap {
+  min-width: 18px;
+  min-height: 25px;
+  margin-top: 3px;
+  padding-bottom: 2px;
+  padding-left: 6px;
+  padding-right: 6px;
+  color: #000;
+  background-color: #fff;
+  border: 2px solid;
+  border-color: gray;
   border-radius: 5px;
-  box-shadow: 0px 1px 0px #fff inset, 0px -2px 0px #dedede inset;
-  color: #555753;
-  padding: 3px 8px 3px 8px; }
+  box-shadow: inset 0 -3px silver, inset 0 -2px #fff, inset 0 0 0 1px #fff;
+  font-size: smaller; }
 
 *:drop(active):focus,
 *:drop(active) {